<template>
    <div class="homeFooterContainer">
        <div class="homeFooterHome homeFooterBar">
            <router-link to='/'>
                <i class="icon-briefcase homeFooterIcon"></i>
                <div class="homeFooterText">找工作</div>
            </router-link>
        </div>
        <div class="homeFooterAddressBook homeFooterBar">
            <router-link to='/addressbook'>
                <i class="icon-address-book homeFooterIcon"></i>
                <div class="homeFooterText">通讯录</div>      
            </router-link> 
        </div>
        <div class="homeFooterNews homeFooterBar">
            <router-link to='/news'>
                <i class="icon-safari homeFooterIcon"></i>
                <div class="homeFooterText">新鲜事</div>       
            </router-link>  
        </div>
        <div class="homeFooterDialog homeFooterBar">
            <router-link to='/dialog'>
                <i class="icon-bubble2 homeFooterIcon"></i>
                <div class="homeFooterText">会话</div>       
            </router-link>  
        </div>
        <div class="homeFooterUser homeFooterBar">
            <router-link to='/userinfo'>
                <i class="icon-user homeFooterIcon"></i>
                <div class="homeFooterText">我的</div>
            </router-link>          
        </div>
    </div>    
</template>

<script>
export default {
    name:"homeFooter",
    data(){
        return{

        }
    }
}
</script>

<style>
.homeFooterContainer{
    display: flex;
    position: absolute;
    bottom:0rem;
    width: 100%;
    justify-content: space-around;
    text-align: center;
    height: 0.92rem;
    border-top: 1px solid rgba(7, 17, 27, 0.2);
}
.homeFooterIcon{
    font-size: 0.3rem;
    color: #515760;
}
.homeFooterText{
    margin-top: -0.1rem;
    font-size: 0.1rem;
}
.homeFooterBar{
    position: relative;
    margin-top: -0.65rem;
}
</style>
